import "dart:convert";

import "package:ct_pa_majordomo/config/theme_vars.dart";
import "package:ct_pa_majordomo/router/keys.dart";
import "package:ct_pa_majordomo/utils/stacker.dart";
import "package:ct_pa_majordomo/widgets/empty_data/index.dart";
import "package:ct_pa_majordomo/widgets/normal_scaffold/index.dart";
import "package:flutter/cupertino.dart";
import "package:flutter/material.dart";
import "package:flutter_easyloading/flutter_easyloading.dart";

import "../../device/lock/api.dart";

class LockList extends StatefulWidget {
  final int roomId;
  const LockList({super.key, required this.roomId});

  @override
  State<StatefulWidget> createState() => _LockListState();
  
}

class _LockListState extends State<LockList> {

  List _list = [];

  void _getLocks() async {
    EasyLoading.show();
    Map resData = await lockApi.lockByRoomList(widget.roomId);
    EasyLoading.dismiss();
    setState(() {
      _list = resData["data"] ?? [];
    });
  }

  Widget _listItem(Map lock) {
    Map lockInfo = jsonDecode(lock["lockInfo"] ?? "");
    return GestureDetector(
      behavior: HitTestBehavior.opaque,
      onTap: () {
        Stacker.pushNamed(Keys.DEVICE_LOCK_DETAIL, arguments: lock);
      },
      child: Container(
        padding: const EdgeInsets.fromLTRB(12, 12, 16, 12),
        decoration: BoxDecoration(
          borderRadius: BorderRadius.circular(8),
          boxShadow: const [ThemeVars.boxShadow],
          color: Colors.white,
        ),
        child: Row(
          children: [
            Expanded(
              child: Column(
                crossAxisAlignment: CrossAxisAlignment.start,
                children: [
                  Row(
                    children: [
                      Container(
                        alignment: Alignment.center,
                        padding: const EdgeInsets.all(4),
                        decoration: BoxDecoration(
                          borderRadius: BorderRadius.circular(4),
                          color: ThemeVars.colorPrimaryLight,
                        ),
                        child: const Text(
                          "房间",
                          style: TextStyle(
                            color: ThemeVars.colorPrimary,
                            fontSize: 10,
                            height: 1,
                            fontWeight: FontWeight.w500,
                          ),
                        ),
                      ),
                      const SizedBox(width: 8,),
                      Text(
                        lock["lockName"],
                        style: const TextStyle(
                          color: ThemeVars.colorText,
                          fontSize: 14,
                          fontWeight: FontWeight.w600,
                        ),
                      ),
                    ],
                  ),
                  const SizedBox(height: 8,),
                  Row(
                    children: [
                      const Icon(Icons.electrical_services),
                      Text(
                        "${lockInfo["electricQuantity"]}%",
                        style: const TextStyle(
                          fontSize: 14,
                        ),
                      ),
                    ],
                  ),
                ],
              ),
            ),
            const Icon(
              Icons.arrow_forward_ios_rounded,
              size: 18,
              color: ThemeVars.colorTextSec,
            ),
          ],
        ),
      ),
    );
  }

  @override
  void initState() {
    super.initState();
    _getLocks();
  }

  @override
  Widget build(BuildContext context) {
    return NormalScaffold(
      title: "关联门锁",
      child: _list.isNotEmpty ? ListView.separated(
        padding: const EdgeInsets.all(ThemeVars.paddingPage),
        itemBuilder: (BuildContext context, index) => _listItem(_list[index]),
        separatorBuilder: (BuildContext context, index) => const SizedBox(height: 12,),
        itemCount: _list.length
      ) : ListView(
        children: [EmptyData()],
      ),
    );
  }
  
}